<!--
 * @Author: WLang
 * @LastEditors: WLang
 * @Description: 
 * @Date: 2023-07-07 19:30:40
 * @LastEditTime: 2023-07-19 17:27:51
 * @FilePath: \myblog\src\views\UserInfo.vue
-->
<template>
  <el-card class="blog-userInfo">
    <div class="blog-userInfo--title">个人信息</div>
    <BaseForm v-if="isCreate" type="userInfo" ref="form"/>
    <div class="blog-user--btn">
      <el-button type="success" @click="submit">提交修改</el-button>
      <el-button type="primary" @click="reset">重置信息</el-button>
    </div>
  </el-card>
</template>

<script>
import BaseForm from '@/components/base/BaseForm.vue'
export default {
  components:{
    BaseForm
  },
  data(){
    return {
      isCreate: true
    }
  },
created(){},
mounted(){},
watch:{},
computed:{},
methods:{
  submit() {
    let refForm = this.$refs['form'];
        refForm.$refs['elForm'].validate(async (valid) => {
          if (valid) {
            try{
              await this.$api({type: 'putUserInfo', data: refForm.form});
              this.$store.state.userInfo = await this.$api({type: 'getUserInfo'})
              this.$notify.success({
                title: '成功',
                message: '修改成功'
              })
              this.$router.push('/index')
            }
            catch(err)
            {
              this.$notify.error({
              title: '错误',
              message: err.message
              });
              refForm.$refs['elForm'].resetFields();
            }
          } else {
            return false;
          }
        });

  },
  reset() {
    this.isCreate = false;
    this.$nextTick(function () {
      this.isCreate = true;
    })
  }
},
}
</script>
<style lang="scss" scoped>
.blog-userInfo--title{
  margin-bottom: 20px;
}
.blog-user--btn {
  text-align: right;
}
</style>